<script lang="ts" setup>
import {Document,Menu as IconMenu,Setting} from '@element-plus/icons-vue'
import { useRouter } from 'vue-router'
import { ref } from 'vue'
const router = useRouter();
const activePath =ref('order') // 当前默认激活客户管理界面
const setActivePath = () => { // 获取当前菜单激活路径
 activePath.value = router.currentRoute._value.fullPath.split('/')[1];
 console.log(activePath.value)
 if(activePath.value === ''){
   activePath.value = 'order'
 }
 console.log(activePath.value)
}
setActivePath()
import { useCounterStore } from '@/stores/counter';
 const permissions = useCounterStore().permissions;
</script>
<template>
    <el-row class="tac">
      <el-col :span="12 ">
        <el-menu
          active-text-color="#ffd04b"
          background-color="#ffffff "
          class="el-menu-vertical-demo"
          :default-active="activePath"
          text-color="#fff"   
          router="true"
        >
          <el-menu-item index="order" @click="setActivePath()">
            <el-icon><setting /></el-icon>
            <span>订单管理</span>
          </el-menu-item>
          <el-menu-item index="dish" @click="setActivePath()">
            <el-icon><setting /></el-icon>
            <span>药品管理</span>
          </el-menu-item>
          <el-menu-item index="setmeal" @click="setActivePath()">
            <el-icon><setting /></el-icon>
            <span>药品组合</span>
          </el-menu-item>
          <el-menu-item index="category" @click="setActivePath">
            <el-icon><setting /></el-icon>
            <span>药品分类</span>
          </el-menu-item>
          <el-menu-item index="employee" v-if="permissions===1" @click="setActivePath()">
            <el-icon><setting /></el-icon>
            <span>员工管理</span>
          </el-menu-item>
          <el-menu-item index="user" v-if="permissions===1" @click="setActivePath"> 
            <el-icon><setting /></el-icon>
            <span>账号管理</span>
          </el-menu-item>
        </el-menu>
      </el-col>
    </el-row>
  </template>
  
<style scoped>
 .el-menu-vertical-demo{
   display: block;
   background-color: #002fd0;
   color: #ffffff;
   width: 200px;
 }
</style>